<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
<link rel="shortcut icon" type="image/x-icon" href="../assets/favicon.ico">
<title>source\jindo.AjaxHistory.js - Jindo Component - AjaxUI@NHN</title>
<link rel="stylesheet" type="text/css" href="../assets/prettify/prettify-min.css" media="screen">
<script type="text/javascript">
	var isMobile = (function() {
		var r = window.devicePixelRatio || 1;
		if (/windows phone/i.test(navigator.userAgent)) { r = 2; }
		
		var s = Math.max(screen.width / r, screen.height / r);
		
		var m = s < 1024;
		var href = m ? "api.mobile.css" : "api.css";
		document.write('<link rel="stylesheet" type="text/css" href="../assets/' + href + '" media="screen">');
		
		return m;
	})();
</script>

<script type="text/javascript" src="../assets/jindo.desktop.min.js"></script>
<script type="text/javascript" src="../assets/jindo_component.min.js"></script>
</head>
<body class="api-page">
<div id="wrap" class="api-main"><!-- 2Depth 접기 : lft_fold 추가 -->

	<div id="header">
		<h1><a href="../index.html"><span class="blind">JindoJS</span></a></h1>
		<div class="info">
			<span class="version">version 1.6.0</span>
			<span class="bar">|</span>
			<span class="help"><span class="ic_help"></span><a href="http://devcode.nhncorp.com/projects/jindo-component/issue" target="_blank">버그신고/문의</a></span>
		</div>
		<div class="menu">
			<button type="button" id="toggle_search_btn" class="btn_sch"><span class="blind">검색</span></button>
			<button type="button" id="toggle_list_btn" class="btn_snb btn_snb_on"><span class="blind">메뉴</span></button>
			<!-- [D] 클릭시 btn_sch_on,btn_snb_on 추가 -->
		</div>
	</div>

	<!-- sch_frm -->
	<div class="sch_frm hide_when_small">
		<h2 class="blind">검색</h2>
		<div class="filter">
			<input type="search" id="api-filter" placeholder="검색어를 입력하세요.">
		</div>
		<div id="search-tab" style="display:none;">
			<ul class="tabs">
			<li class="tc-tab">전체</li>
			<li class="tc-tab">키워드</li>
			<li class="tc-tab">클래스</li>
			<li class="tc-tab">메서드</li>
			<li class="tc-tab">프로퍼티</li>
			<li class="tc-tab">이벤트</li>
			</ul>
			<div class="panels">
				<ul id="api-all" class="tc-panel"></ul>
				<ul id="api-keywords" class="tc-panel"></ul>
				<ul id="api-classes" class="tc-panel"></ul>
				<ul id="api-methods" class="tc-panel"></ul>
				<ul id="api-attrs" class="tc-panel"></ul>
				<ul id="api-events" class="tc-panel"></ul>
			</div>

		</div>
	</div>
	<!-- // sch_frm -->

	<!-- container -->
	<div id="container">
		<!-- left-columns -->
		<div id="left-columns" class="sidemenu has_scrollbar">
			<h2 class="blind"><a href="../index.html"><span>APIs</span></a></h2>
<div class="snb depth1 scrollbar hide_when_small">
	<!-- [D] style="width:135px; height:384px; -->
	<div class="scrollbar-box">
		<div class="scrollbar-content">
			<div><ul>
			            <li class="">
			            	<a href="../classes/jindo.Accordion.html" class="">
			                	Accordion
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.AjaxHistory.html" class="">
			                	AjaxHistory
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.BrowseButton.html" class="">
			                	BrowseButton
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Cache.html" class="">
			                	Cache
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Calendar.html" class="">
			                	Calendar
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Canvas.html" class="">
			                	Canvas
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.CheckBox.html" class="">
			                	CheckBox
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.CircularRolling.html" class="">
			                	CircularRolling
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Clipboard.html" class="">
			                	Clipboard
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Component.html" class="">
			                	Component
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DataBridge.html" class="">
			                	DataBridge
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DatePicker.html" class="">
			                	DatePicker
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DefaultTextValue.html" class="">
			                	DefaultTextValue
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Dialog.html" class="">
			                	Dialog
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DragArea.html" class="">
			                	DragArea
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DropArea.html" class="">
			                	DropArea
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.DynamicTree.html" class="">
			                	DynamicTree
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Effect.html" class="">
			                	Effect
								
								

							    
						        
						            <span class="flag static" title="static"><span class="blind">static</span></span>
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.FileUploader.html" class="">
			                	FileUploader
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.FloatingLayer.html" class="">
			                	FloatingLayer
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Foggy.html" class="">
			                	Foggy
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Formatter.html" class="">
			                	Formatter
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.HTMLComponent.html" class="">
			                	HTMLComponent
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.InlineTextEdit.html" class="">
			                	InlineTextEdit
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.LayerEffect.html" class="">
			                	LayerEffect
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.LayerManager.html" class="">
			                	LayerManager
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.LayerPosition.html" class="">
			                	LayerPosition
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.LazyLoading.html" class="">
			                	LazyLoading
								
								

							    
						        
						            <span class="flag static" title="static"><span class="blind">static</span></span>
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.ModalDialog.html" class="">
			                	ModalDialog
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.MouseGesture.html" class="">
			                	MouseGesture
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.MultipleAjaxRequest.html" class="">
			                	MultipleAjaxRequest
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.NumberFormatter.html" class="">
			                	NumberFormatter
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.NumericStepper.html" class="">
			                	NumericStepper
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Pagination.html" class="">
			                	Pagination
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Rolling.html" class="">
			                	Rolling
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.RollingChart.html" class="">
			                	RollingChart
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.RolloverArea.html" class="">
			                	RolloverArea
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.RolloverClick.html" class="">
			                	RolloverClick
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.ScrollBar.html" class="">
			                	ScrollBar
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.ScrollBox.html" class="">
			                	ScrollBox
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.SelectArea.html" class="">
			                	SelectArea
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.SelectBox.html" class="">
			                	SelectBox
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Slider.html" class="">
			                	Slider
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.StarRating.html" class="">
			                	StarRating
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.TabControl.html" class="">
			                	TabControl
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.TextRange.html" class="">
			                	TextRange
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Timer.html" class="">
			                	Timer
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Transition.html" class="">
			                	Transition
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.Tree.html" class="">
			                	Tree
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.UIComponent.html" class="">
			                	UIComponent
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.UploadQueue.html" class="">
			                	UploadQueue
								
								

							    
						        
			            	</a>
			            </li>
			        
			            <li class="">
			            	<a href="../classes/jindo.WatchInput.html" class="">
			                	WatchInput
								
								

							    
						        
			            	</a>
			            </li>
			        </ul></div>
		</div>
	</div>
	<div class="scrollbar-v">
		<div class="scrollbar-button-up"></div>
		<div class="scrollbar-track">
			<div class="scrollbar-thumb" style="top: 0px; height: 222px; "></div>
		</div>
		<div class="scrollbar-button-down"></div>
	</div>
</div>


<button type="button" title="펼치기" class="btn_open">바로가기 열기<span class="ic"></span></button>
<button type="button" title="접기" class="btn_close">바로가기 닫기<span class="ic"></span></button>

		</div>
		<!-- // left-columns -->

		<!-- main content -->
		<div id="main">
			<div class="main_fix">
				<div class="content">
	
	<h1 class="blind">source/jindo.AjaxHistory.js</h1>
	<div class="tc-panel first">
		<dl class="relation">
			<dt>파일명</dt>
			<dd>jindo.AjaxHistory.js</dd>
			<dt>경로</dt>
			<dd>source/</dd>
		</dl>
		<div id="file" class="file">
		    <pre class="code prettyprint linenums">/**
	@fileOverview&nbsp;Ajax&nbsp;History&nbsp;&nbsp;
	@author&nbsp;AjaxUI-1&nbsp;&lt;TarauS&gt;&nbsp;modified&nbsp;by&nbsp;senxation
	@version&nbsp;#__VERSION__#
**/

/**
&nbsp;&nbsp;&nbsp;&nbsp;한&nbsp;페이지내에서&nbsp;모든&nbsp;기능을&nbsp;구현하는&nbsp;서비스에서&nbsp;브라우저&nbsp;히스토리&nbsp;기능을&nbsp;사용&nbsp;할&nbsp;수&nbsp;있도록&nbsp;하는&nbsp;컴포넌트
&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;@class&nbsp;jindo.AjaxHistory
&nbsp;&nbsp;&nbsp;&nbsp;@extends&nbsp;jindo.Component
&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;@keyword&nbsp;ajax,&nbsp;history,&nbsp;히스토리,&nbsp;hash,&nbsp;해쉬,&nbsp;해시,&nbsp;pushState
**/
jindo.AjaxHistory&nbsp;=&nbsp;jindo.$Class({
	/**&nbsp;@lends&nbsp;jindo.AjaxHistory.prototype&nbsp;*/
	
	/**
		이벤트&nbsp;핸들러&nbsp;저장&nbsp;객체
		@type&nbsp;{HashTable}
	**/
	_htEventHandler&nbsp;:&nbsp;{},
	/**
		히스토리&nbsp;데이터&nbsp;저장&nbsp;객체
		@type&nbsp;{HashTable}
	**/
	_htHistoryData&nbsp;:&nbsp;{},
	/**
		에이전트&nbsp;정보&nbsp;저장&nbsp;객체
		@type&nbsp;{Object}
	**/
	_oAgent&nbsp;:&nbsp;null,
	/**
		IE&nbsp;7이하에서&nbsp;사용할&nbsp;아이프레임&nbsp;객체
		@type&nbsp;{WrappingElement}
	**/
	_welIFrame&nbsp;:&nbsp;null,
	/**
		setInterval()의&nbsp;리턴&nbsp;값
		@type&nbsp;{Number}
	**/
	_nIntervalId&nbsp;:&nbsp;0,
	/**
		로케이션&nbsp;변경&nbsp;체크&nbsp;방법
		@type&nbsp;{String}
	**/
	_sCheckType&nbsp;:&nbsp;&quot;&quot;,
	/**
		컴포넌트&nbsp;인스턴스의&nbsp;고유&nbsp;아이디&nbsp;값
		@type&nbsp;{String}
	**/
	_sComponentId&nbsp;:&nbsp;&quot;&quot;,

	/**
		스태틱&nbsp;메서드
		@private
	**/
	$static&nbsp;:&nbsp;{
		/**
			IE7&nbsp;이하의&nbsp;브라우저에서&nbsp;로케이션&nbsp;변경을&nbsp;체크하기&nbsp;위한&nbsp;함수&lt;br/&gt;
			Hidden&nbsp;IFrame의&nbsp;history.html이&nbsp;로딩될&nbsp;때마다&nbsp;이&nbsp;함수를&nbsp;호출&nbsp;함
			
			@method&nbsp;checkIFrameChange
			@static
			@private
			@param&nbsp;oLocation
		**/
		checkIFrameChange&nbsp;:&nbsp;function(oLocation){
			var&nbsp;htQueryString&nbsp;=&nbsp;jindo.$S(oLocation.search.substring(1)).parseString();
			this._aInstances[0]._checkLocationChange(encodeURIComponent(htQueryString.hash));
			/*
			for(var&nbsp;i=0;&nbsp;i&lt;aInstanceList.length;&nbsp;i++){
				if(htQueryString.componentId&nbsp;==&nbsp;aInstanceList[i].getComponentId()){
				alert(&quot;iframe&nbsp;callback&nbsp;:&nbsp;&quot;+htQueryString.hash);
					aInstanceList[i]._checkLocationChange(encodeURIComponent(htQueryString.hash));
					break;
				}
			}
			*/
		}
	},
	
	/**
		@constructor
		@param&nbsp;{Object}&nbsp;[htOption]&nbsp;초기화&nbsp;옵션&nbsp;객체
			@param&nbsp;{Number}&nbsp;[htOption.nCheckInterval=100]&nbsp;IE&nbsp;7&nbsp;이하나&nbsp;onhashchange&nbsp;이벤트를&nbsp;지원하지&nbsp;않는&nbsp;브라우저에서&nbsp;location.hash의&nbsp;변경을&nbsp;체크할&nbsp;주기.&lt;br/&gt;특별히&nbsp;문제가&nbsp;없을&nbsp;경우,&nbsp;변경을&nbsp;할&nbsp;필요&nbsp;없음
			@param&nbsp;{String}&nbsp;[htOption.sIFrameUrl=&quot;history.html&quot;]&nbsp;IE7&nbsp;이하의&nbsp;브라우저에서&nbsp;로케이션&nbsp;변경을&nbsp;체크하기&nbsp;위해&nbsp;로딩하는&nbsp;웹문서의&nbsp;위치
		@example
			var&nbsp;oAjaxHistoryInstance&nbsp;=&nbsp;new&nbsp;jindo.AjaxHistory({
				//&nbsp;IE7&nbsp;이하의&nbsp;브라우저에서&nbsp;로케이션&nbsp;변경을&nbsp;체크하기&nbsp;위해&nbsp;로딩하는&nbsp;웹문서의&nbsp;위치
				&quot;sIFrameUrl&quot;&nbsp;:&nbsp;&quot;history.html&quot;,
				//&nbsp;attach()&nbsp;함수를&nbsp;사용하지&nbsp;않고,&nbsp;초기화&nbsp;시에&nbsp;이벤트&nbsp;핸들러를&nbsp;연결하기&nbsp;위해&nbsp;사용
				&quot;htCustomEventHandler&quot;&nbsp;:&nbsp;{
					&quot;load&quot;&nbsp;:&nbsp;function(){
						alert(&quot;load&nbsp;event&quot;);
					},
					&quot;change&quot;&nbsp;:&nbsp;function(oChangeEvent){
						alert(&quot;change&nbsp;event&quot;);
					}
				},
				//&nbsp;setInterval()을&nbsp;이용하여&nbsp;로케이션&nbsp;변경을&nbsp;체크&nbsp;시,&nbsp;체크&nbsp;주기
				&quot;nCheckInterval&quot;&nbsp;:&nbsp;100
			});
		
			oAjaxHistoryInstance.initialize();&nbsp;//초기화
			oAjaxHistoryInstance.addHistory({
				&quot;sPageType&quot;&nbsp;:&nbsp;&quot;layer&quot;,
				&quot;aParameter&quot;&nbsp;:&nbsp;[
					&quot;1&quot;,&nbsp;&quot;2&quot;,&nbsp;&quot;3&quot;
				]
			});
	**/
	$init&nbsp;:&nbsp;function(htOption){
		this._oAgent&nbsp;=&nbsp;jindo.$Agent().navigator();
		this._sComponentId&nbsp;=&nbsp;&quot;AjaxHistory&quot;+(new&nbsp;Date()).getTime();
		this.option({
			sIFrameUrl&nbsp;:&nbsp;&quot;history.html&quot;,
			nCheckInterval&nbsp;:&nbsp;100
		});
		this.option(htOption&nbsp;||&nbsp;{});
		
		(this.constructor._aInstances&nbsp;=&nbsp;this.constructor._aInstances&nbsp;||&nbsp;[]).push(this);
	},

	/**
		컴포넌트&nbsp;초기화&nbsp;후에,&nbsp;로케이션&nbsp;변경&nbsp;체크&nbsp;및&nbsp;초기&nbsp;이벤트&nbsp;발생을&nbsp;위한&nbsp;초기화&nbsp;함수
		
		@method&nbsp;initialize
		@return&nbsp;{this}&nbsp;컴포넌트&nbsp;인스턴스&nbsp;자신
	**/
	initialize&nbsp;:&nbsp;function(){
		var&nbsp;sHash&nbsp;=&nbsp;this._getLocationHash();
		
		//&nbsp;onHashChange&nbsp;이벤트를&nbsp;지원하는&nbsp;경우
		if((this._oAgent.ie&nbsp;&amp;&amp;&nbsp;(document.documentMode||this._oAgent.version)&nbsp;&gt;=&nbsp;8&nbsp;&amp;&amp;&nbsp;jindo.$Document().renderingMode()&nbsp;==&nbsp;&quot;Standards&quot;)&nbsp;||&nbsp;(this._oAgent.firefox&nbsp;&amp;&amp;&nbsp;this._oAgent.version&nbsp;&gt;=&nbsp;3.6)&nbsp;||&nbsp;(this._oAgent.chrome&nbsp;&amp;&amp;&nbsp;this._oAgent.version&nbsp;&gt;&nbsp;3)&nbsp;||&nbsp;(this._oAgent.safari&nbsp;&amp;&amp;&nbsp;this._oAgent.version&nbsp;&gt;=&nbsp;5)&nbsp;||&nbsp;(this._oAgent.opera&nbsp;&amp;&amp;&nbsp;this._oAgent.version&nbsp;&gt;=&nbsp;10.6)){
			this._htEventHandler[&quot;hashchange&quot;]&nbsp;=&nbsp;jindo.$Fn(this._checkLocationChange,&nbsp;this).attach(window,&nbsp;&quot;hashchange&quot;);
			this._sCheckType&nbsp;=&nbsp;&quot;hashchangeevent&quot;;
		//&nbsp;IE&nbsp;7&nbsp;이하인&nbsp;경우
		}else&nbsp;if(this._oAgent.ie){
			this._welIFrame&nbsp;=&nbsp;jindo.$Element(&quot;&lt;IFRAME&gt;&quot;);
			this._welIFrame.hide();
			this._welIFrame.appendTo(document.body);
			this._sCheckType&nbsp;=&nbsp;&quot;iframe&quot;;
			
		//&nbsp;setInterval()&nbsp;함수를&nbsp;이용하여&nbsp;체크해야&nbsp;하는&nbsp;경우
		}else{
			this._nIntervalId&nbsp;=&nbsp;setInterval(jindo.$Fn(this._checkLocationChange,&nbsp;this).bind(),&nbsp;this.option(&quot;nCheckInterval&quot;));
			this._sCheckType&nbsp;=&nbsp;&quot;setinterval&quot;;
		}

		if(sHash&amp;&amp;sHash!=&quot;%7B%7D&quot;){
			
			if(this._sCheckType&nbsp;==&nbsp;&quot;iframe&quot;){
				this._welIFrame.$value().src&nbsp;=&nbsp;this.option(&quot;sIFrameUrl&quot;)&nbsp;+&nbsp;&quot;?hash=&quot;&nbsp;+&nbsp;sHash;
			}else{
				this._htHistoryData&nbsp;=&nbsp;this._getDecodedData(sHash);
				/**
					사용자가&nbsp;앞으로/뒤로가기&nbsp;버튼을&nbsp;눌러&nbsp;이동을&nbsp;하거나&nbsp;히스토리&nbsp;데이터가&nbsp;포함된&nbsp;URL을&nbsp;이용하여&nbsp;접근시&nbsp;발생
					
					@event&nbsp;change
					@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
					@param&nbsp;{Object}&nbsp;htHistoryData&nbsp;커스텀&nbsp;이벤트객체&nbsp;프로퍼티2
					@example
						oAjaxHistory.attach(&quot;change&quot;,&nbsp;function(oCustomEvent){
							//&nbsp;htHistoryData의&nbsp;데이터를&nbsp;바탕으로&nbsp;화면의&nbsp;UI를&nbsp;재구성
							if(oChangeEvent.sPageType&nbsp;==&nbsp;&quot;main_page&quot;){
								showPage(oChangeEvent.sLayer,&nbsp;oChangeEvent.nPage);
							}else{
								showPageAnother(oChangeEvent.sLayer,&nbsp;oChangeEvent.nPage);
							}
						});
				**/
				this.fireEvent(&quot;change&quot;,&nbsp;{
					htHistoryData&nbsp;:&nbsp;this._htHistoryData
				});
			}
		}else{
			
			var&nbsp;that&nbsp;=&nbsp;this;
			if(this._oAgent.ie&amp;&amp;(document.documentMode||this._oAgent.version)&nbsp;&lt;&nbsp;8){
				var&nbsp;ifr&nbsp;=&nbsp;this._welIFrame.$value();
			&nbsp;&nbsp;&nbsp;&nbsp;ifr.onreadystatechange&nbsp;=&nbsp;function(){
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(ifr.readyState&nbsp;==&nbsp;&quot;complete&quot;){
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	/**
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*&nbsp;페이지&nbsp;로딩시&nbsp;발생되는데,&nbsp;URL에&nbsp;히스토리&nbsp;데이터를&nbsp;포함하고&nbsp;있을&nbsp;경우엔&nbsp;load&nbsp;이벤트&nbsp;대신&nbsp;change&nbsp;이벤트가&nbsp;발생
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*&nbsp;@event&nbsp;load
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*&nbsp;@param&nbsp;{String}&nbsp;sType&nbsp;커스텀&nbsp;이벤트명
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*&nbsp;@example
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*&nbsp;	oAjaxHistory.attach(&quot;load&quot;,&nbsp;function(oCustomEvent)&nbsp;{
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*&nbsp;		//히스토리&nbsp;데이터를&nbsp;포함하지&nbsp;않은&nbsp;URL로&nbsp;페이지가&nbsp;로딩되었을&nbsp;경우,&nbsp;초기&nbsp;UI&nbsp;구성에&nbsp;대한&nbsp;작업을&nbsp;수행
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*&nbsp;	});
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;	&nbsp;*/
						that.fireEvent(&quot;load&quot;);
						ifr.onreadystatechange&nbsp;=&nbsp;function(){};
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
			&nbsp;&nbsp;&nbsp;&nbsp;};

				ifr.src&nbsp;=&nbsp;this.option(&quot;sIFrameUrl&quot;);
			}else{
				setTimeout(function(){
					that.fireEvent(&quot;load&quot;);	
				},0);	
			}
		}
		
		return&nbsp;this;
	},

	/**
		컴포넌트의&nbsp;고유&nbsp;아이디를&nbsp;리턴
		
		@method&nbsp;getComponentId
		@return&nbsp;{String}&nbsp;컴포넌트&nbsp;고유&nbsp;아이디
	**/
	getComponentId&nbsp;:&nbsp;function(){
		return&nbsp;this._sComponentId;
	},

	/**
		현재&nbsp;설정되어&nbsp;있는&nbsp;Hash&nbsp;String을&nbsp;리턴
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@method&nbsp;_getLocationHash
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@private
		@return&nbsp;{String}&nbsp;현재&nbsp;설정된&nbsp;Hash&nbsp;String
	**/
	_getLocationHash&nbsp;:&nbsp;function(){
		var&nbsp;oAgent&nbsp;=&nbsp;jindo.$Agent().navigator();
		return&nbsp;oAgent.firefox&nbsp;?&nbsp;encodeURIComponent(location.hash.substring(1))&nbsp;:&nbsp;(location.hash.substring(1)||&quot;%7B%7D&quot;);
	},

	/**
		location.hash&nbsp;설정&nbsp;함수
		@method&nbsp;_setLocationHash
		@private
		@param&nbsp;{String}&nbsp;sHash&nbsp;location.hash를&nbsp;sHash로&nbsp;변경
	**/
	_setLocationHash&nbsp;:&nbsp;function(sHash){
		location.hash&nbsp;=&nbsp;sHash==&quot;%7B%7D&quot;?&quot;&quot;:sHash;
	},

	/**
		htHistoryData를&nbsp;브라우저의&nbsp;히스토리에&nbsp;추가
		
		@method&nbsp;addHistory
		@param&nbsp;{Object}&nbsp;htHistoryData&nbsp;추가할&nbsp;히스토리&nbsp;데이터&nbsp;객체
		@return&nbsp;{Boolean}&nbsp;히스토리&nbsp;추가&nbsp;결과
	**/
	addHistory&nbsp;:&nbsp;function(htHistoryData){;
		if(htHistoryData&nbsp;&amp;&amp;&nbsp;typeof(htHistoryData)&nbsp;==&nbsp;&quot;object&quot;&nbsp;&amp;&amp;&nbsp;jindo.$H(htHistoryData).length()&nbsp;&gt;&nbsp;0){
			this._htHistoryData&nbsp;=&nbsp;jindo.$Json(jindo.$Json(htHistoryData).toString()).toObject();&nbsp;//deep&nbsp;copy
			var&nbsp;sHash&nbsp;=&nbsp;this._getEncodedData(htHistoryData);

			//&nbsp;현재&nbsp;설정된&nbsp;데이터와&nbsp;추가하려는&nbsp;데이터가&nbsp;같지&nbsp;않을&nbsp;경우에만&nbsp;히스토리에&nbsp;추가
			if(this._getLocationHash()&nbsp;!=&nbsp;sHash){
				this._setLocationHash(sHash);
				if(this._sCheckType&nbsp;==&nbsp;&quot;iframe&quot;){
					this._welIFrame.$value().src&nbsp;=&nbsp;this.option(&quot;sIFrameUrl&quot;)&nbsp;+&nbsp;&quot;?hash=&quot;&nbsp;+&nbsp;sHash;
				}
				return&nbsp;true;
			}else{
				return&nbsp;false;
			}
		}else{
			return&nbsp;false;
		}
	},

	/**
		히스토리&nbsp;변경을&nbsp;체크하여&nbsp;change&nbsp;이벤트를&nbsp;발생시키는&nbsp;함수
		
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@method&nbsp;_checkLocationChange
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@private
		@param&nbsp;{String}&nbsp;[sHash]&nbsp;로케이션&nbsp;변경&nbsp;체크&nbsp;시,&nbsp;사용할&nbsp;히스토리&nbsp;데이터&nbsp;문자열
	**/
	_checkLocationChange&nbsp;:&nbsp;function(sHash){
		sHash&nbsp;=&nbsp;sHash==&quot;undefined&quot;&nbsp;?&nbsp;&quot;%7B%7D&quot;:&nbsp;sHash;
//		console.log(sHash)
		sHash&nbsp;=&nbsp;(sHash&nbsp;&amp;&amp;&nbsp;typeof(sHash)&nbsp;==&nbsp;&quot;string&quot;)&nbsp;?&nbsp;sHash&nbsp;:&nbsp;this._getLocationHash();
		var&nbsp;htCurrentHistoryData&nbsp;=&nbsp;this._getDecodedData(sHash);
//		console.log(htCurrentHistoryData);
		
		if(!this._compareData(this._htHistoryData,&nbsp;htCurrentHistoryData)){
			this._htHistoryData&nbsp;=&nbsp;htCurrentHistoryData;
			if(this._sCheckType&nbsp;==&nbsp;&quot;iframe&quot;){
				this._setLocationHash(sHash);
			}
//			console.log(this._htHistoryData);
			//&nbsp;change&nbsp;이벤트&nbsp;발생
			this.fireEvent(&quot;change&quot;,&nbsp;{
				htHistoryData&nbsp;:&nbsp;this._htHistoryData
			});
		}
	},

	/**
		htHistoryData&nbsp;객체를&nbsp;Json&nbsp;문자열로&nbsp;변환&nbsp;후,&nbsp;인코딩하여&nbsp;리턴

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@method&nbsp;_getEncodedData
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@private
		@param&nbsp;{Object}&nbsp;htHistoryData&nbsp;히스토리&nbsp;데이터&nbsp;객체
		@return&nbsp;{String}&nbsp;Json&nbsp;문자열로&nbsp;변환&nbsp;후,&nbsp;인코딩한&nbsp;문자열
		@remark&nbsp;JSON.stringify()&nbsp;함수를&nbsp;브라우저에서&nbsp;지원할&nbsp;경우,&nbsp;해당&nbsp;함수&nbsp;사용
		@remark&nbsp;위의&nbsp;함수를&nbsp;지원하지&nbsp;않을&nbsp;경우,&nbsp;jindo.$Json().toString()&nbsp;함수&nbsp;사용
	**/
	_getEncodedData&nbsp;:&nbsp;function(htHistoryData){
		if(htHistoryData){
			//&nbsp;JSON.stringify()&nbsp;함수를&nbsp;지원하는&nbsp;경우
			if(typeof(JSON)&nbsp;==&nbsp;&quot;object&quot;&nbsp;&amp;&amp;&nbsp;typeof(JSON.stringify)&nbsp;==&nbsp;&quot;function&quot;){
				return&nbsp;encodeURIComponent(JSON.stringify(htHistoryData));
			}else{
				return&nbsp;encodeURIComponent(jindo.$Json(htHistoryData).toString());
			}
		}else{
			return&nbsp;&quot;&quot;;
		}
	},
	
	/**
		인코딩된&nbsp;히스토리&nbsp;데이터를&nbsp;HashTable&nbsp;객체로&nbsp;변환&nbsp;후,&nbsp;리턴

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@method&nbsp;_getDecodedData
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@private
		@param&nbsp;{String}&nbsp;sEncodedHash&nbsp;인코딩된&nbsp;히스토리&nbsp;데이터
		@return&nbsp;{Object}&nbsp;디코딩&nbsp;후,&nbsp;HashTable로&nbsp;변환한&nbsp;객체
		@remark&nbsp;JSON.parse()&nbsp;함수를&nbsp;브라우저에서&nbsp;지원할&nbsp;경우,&nbsp;해당&nbsp;함수&nbsp;사용
		@remark&nbsp;위의&nbsp;함수를&nbsp;지원하지&nbsp;않을&nbsp;경우,&nbsp;jindo.$Json().toObject()&nbsp;함수&nbsp;사용
	**/
	_getDecodedData&nbsp;:&nbsp;function(sEncodedHash){
		try&nbsp;{
			if(sEncodedHash){
				var&nbsp;sHashString&nbsp;=&nbsp;decodeURIComponent(sEncodedHash);
				//&nbsp;JSON.parse()&nbsp;함수를&nbsp;지원하는&nbsp;경우
				if(typeof(JSON)&nbsp;==&nbsp;&quot;object&quot;&nbsp;&amp;&amp;&nbsp;typeof(JSON.parse)&nbsp;==&nbsp;&quot;function&quot;){
					return&nbsp;JSON.parse(sHashString);
				}else{
					return&nbsp;jindo.$Json(sHashString).toObject();
				}
			}
		}&nbsp;catch&nbsp;(e)&nbsp;{}
		return&nbsp;{};
	},

	/**
		두&nbsp;데이터&nbsp;객체를&nbsp;비교하여&nbsp;결과를&nbsp;리턴

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@method&nbsp;_compareData
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;@private
		@param&nbsp;{Object}&nbsp;htBase&nbsp;비교&nbsp;기준&nbsp;객체
		@param&nbsp;{Object}&nbsp;htComparison&nbsp;비교&nbsp;객체
		@param&nbsp;{Boolean}&nbsp;비교&nbsp;결과
		@remark&nbsp;하위&nbsp;데이터가&nbsp;Object나&nbsp;Array일&nbsp;경우,&nbsp;재귀적으로&nbsp;비교
	**/
	_compareData&nbsp;:&nbsp;function(htBase,&nbsp;htComparison){
		
		if&nbsp;(!htBase&nbsp;||&nbsp;!htComparison)&nbsp;{&nbsp;return&nbsp;false;&nbsp;}
			
		var&nbsp;wBase&nbsp;=&nbsp;htBase&nbsp;instanceof&nbsp;Array&nbsp;?&nbsp;jindo.$A(htBase)&nbsp;:&nbsp;jindo.$H(htBase);
		var&nbsp;wComparison&nbsp;=&nbsp;htComparison&nbsp;instanceof&nbsp;Array&nbsp;?&nbsp;jindo.$A(htComparison)&nbsp;:&nbsp;jindo.$H(htComparison);
		
		if&nbsp;(wBase.length()&nbsp;!=&nbsp;wComparison.length())&nbsp;{&nbsp;return&nbsp;false;&nbsp;}
		
		var&nbsp;bRet&nbsp;=&nbsp;true;
		var&nbsp;fpCallee&nbsp;=&nbsp;arguments.callee;
		
		wBase.forEach(function(v,&nbsp;k)&nbsp;{
			
			if(typeof(v)&nbsp;==&nbsp;&quot;object&quot;){
				if(!fpCallee(v,&nbsp;htComparison[k])){
					bRet&nbsp;=&nbsp;false;
					return;
				}
			}else{
				if(v&nbsp;!=&nbsp;htComparison[k]){
					bRet&nbsp;=&nbsp;false;
					return;
				}
			}
			
		});
		
		return&nbsp;bRet;

	},

	/**
		컴포넌트&nbsp;소멸자
		
		@method&nbsp;destroy
	**/
	destroy&nbsp;:&nbsp;function(){
		//&nbsp;설정된&nbsp;로케이션&nbsp;체크&nbsp;방법을&nbsp;해제
		if(this._sCheckType&nbsp;==&nbsp;&quot;hashchangeevent&quot;){
			this._htEventHandler[&quot;hashchange&quot;].detach(window,&nbsp;&quot;hashchange&quot;);
		}else&nbsp;if(this._sCheckType&nbsp;==&nbsp;&quot;iframe&quot;){
			this._welIFrame.leave();
		}else{
			clearInterval(this._nIntervalId);
		}
		//&nbsp;프로퍼티&nbsp;초기화
		this._htEventHandler&nbsp;=&nbsp;null;
		this._htHistoryData&nbsp;=&nbsp;null;
		this._oAgent&nbsp;=&nbsp;null;
		this._welIFrame&nbsp;=&nbsp;null;
		this._nIntervalId&nbsp;=&nbsp;null;
		this._sCheckType&nbsp;=&nbsp;null;
		this._sComponentId&nbsp;=&nbsp;null;

		var&nbsp;aInstances&nbsp;=&nbsp;this.constructor._aInstances&nbsp;||&nbsp;[];
		var&nbsp;nIndex&nbsp;=&nbsp;jindo.$A(aInstances).indexOf(this);
		
		if&nbsp;(nIndex&nbsp;&gt;&nbsp;-1)&nbsp;{&nbsp;aInstances.splice(nIndex,&nbsp;1);&nbsp;}
	}
}).extend(jindo.Component);</pre>
		</div>
	</div>
</div>

			</div>
		</div>
		<!-- // main content -->

	</div>
	<!-- // container -->

	<!-- footer -->
	<div id="footer">
		<p>Copyright ©<a href="http://nhncorp.com/" target="_blank">NHN Corp.</a> Platform Ajax Team. All Rights Reserved.</p>
	</div>
	<!-- // footer -->

</div>
<!-- // wrap -->

<style type="text/css">

	.item {
		transition:background .2s linear;
		-webkit-transition:background .2s linear;
		-moz-transition:background .2s linear;
		-o-transition:background .2s linear;
		-ms-transition:background .2s linear;
	}
	
	.highlight {
		background-color:#ffffd8 !important;
	}
	
	li.selected a.highlight {
		background-color:#aa8 !important;
	}
	
	.hide-deprecated .deprecated-item, .hide-inherited .inherited-item, .private {
		display:none;
	}
	
	.scrollbar-v, .scrollbar-h { display:none; }
	.scrollbar-show { display:block; }
	
	.api-page .tbl_fold .more_history { display:none; }
	
	/* FILE */
	.file pre.code {
		border:1px solid #ccc;
		padding:0;
	}
	
	.file ol {
		padding-left: 4em;
		background-color: #f9f9f9;
	}

	.file ol li {
		list-style: decimal;
		border-left:1px solid #ccc;
		padding:2px 4px;
	}
	
	.file li.L1, .file li.L3, .file li.L5, .file li.L7, .file li.L9 {
		background-color: #f9f9f9;	
	}

	.file li.L0, .file li.L2, .file li.L4, .file li.L6, .file li.L8 { 
		background-color: #f0f0f0;
	}
	
</style>
<script type="text/javascript" src="../assets/prettify/prettify-min.js"></script>
<script type="text/javascript" src="../assets/hash.js"></script>
<script type="text/javascript" src="../assets/api-list.js"></script>
<script type="text/javascript" src="../assets/api-search.js"></script>
<script type="text/javascript" src="../assets/../api.js?callback=APISearch.setData"></script>
<script type="text/javascript">
	var projectRoot = "../";
	var projectAssets = "../assets";
	
    apiDocs(projectAssets);	
</script>
</body>
</html>